<!DOCTYPE html>
<html>
<head>
	<title>Demo</title>
	<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
	<script src="/socket.io/socket.io.js"></script>
	<script>
		var socket = io();
		$().ready(function(){
			$('#btConnect').click(function(){
				var msg = 'user send a request connect to mongodb';
				socket.emit('connectdb', msg);
				//alert(msg);
			});
			$('#btInsert').click(function(){
				var msg = [{
					id:1,
					username:'ndp1007',
					password:'100789',
					status:"online"
				},{
					id:2,
					username:'phillip7.et',
					password:'100789',
					status:"locked"
				}];
				socket.emit('insert', msg);
			});
			$('#btUpdate').click(function(){
				var msg = [{id:3},{$set:{status:"online"}}];
				// msg[0] = query
				// msg[1] = update 
				socket.emit('update', msg);
			});
			$('#btGetList').click(function(){
				var msg = {id:111};
				socket.emit('get', msg);
			});
			$('#btDelete').click(function(){
				var msg = {id:111};
				socket.emit('delete', msg);
			});
		});
		socket.on('connectdb',function(msg){
			var logText = $('#divLog').html() + '<br/>';
			$('#divLog').html(logText + JSON.stringify(msg));
		});
		socket.on('insert',function(msg){
			var logText = $('#divLog').html() + '<br/>';
			$('#divLog').html(logText + JSON.stringify(msg));
		});
		socket.on('update',function(msg){
			var logText = $('#divLog').html() + '<br/>';
			$('#divLog').html(logText + JSON.stringify(msg));
		});
		socket.on('get',function(msg){
			var logText = $('#divLog').html() + '<br/>';
			$('#divLog').html(logText + JSON.stringify(msg));
		});
		socket.on('delete',function(msg){
			var logText = $('#divLog').html() + '<br/>';
			$('#divLog').html(logText + JSON.stringify(msg));
		});
	</script>
</head>
<body>
	<input id="btConnect"	type="button" value="Connect to Mongdb" />
	<input id="btInsert" 	type="button" value="Insert" />
	<input id="btUpdate" 	type="button" value="Update" />
	<input id="btGetList"	type="button" value="Get List" />
	<input id="btDelete"	type="button" value="Delete" />
	<div><pre id="divLog"></pre></div>	
</body>
</html>